import React from 'react'
import './index.css'

const SwiperItem = (props) => {
  return <div className="swiper-item"><img src={props.url} /></div>
}

export default class SwiperContainer extends React.Component {
  constructor (props) {
    super(props)
    this.state = {
      list: [
        {
          url: './img/4d086e061d950a7b86bee8d400d162d9f2d3c913.jpg'
        },
        {
          url: './img/9d82d158ccbf6c81887581cdb63eb13533fa4050.jpg'
        },
        {
          url: './img/121.jpg'
        },
        {
          url: './img/26008806_111416607191_2.jpg'
        }
      ]
    }
    this.log = this.log.bind(this)
  }
  log (i, e) {
    console.log(i)
  }
  render () {
    return (
      <div>
        {
          this.state.list.map((item, index) => <SwiperItem onClick={this.log.bind(this,index)} url={item.url} key={index}></SwiperItem>)
        }
      </div>
    )
  }
}
